{extend name="common/base" /}

{block name="body"} 
<div class="head_box">
    <i class="layui-icon layui-icon-left back" data-btn="backNav" ></i>
    <div class="t1">开始记录</div>
 </div>
 <main class="main_body">
    <div class="recode_text">
       <div class="ftc b1">
          <span>{$detail.crane.name}</span>
          <span>{$detail.produce_no}</span>
          <span>{$detail.stage.name}</span>
          <span>{$detail.segment.name}</span>
          <span>{$detail.segment_type_no}</span>
       </div>
       <div>备注：{$detail.remarks}</div>
       <div class="gary_c6">历史问题提醒：</div>
    </div>
    <div data-tab="index_new" data-block="title" class="active_ul title_nav mt25">
       <div class="item active">进行中的工作</div>
       <!-- <div class="item">已完成的工作</div> -->
    </div>
    <div class="layui-tab-content" data-tab="index_new" data-block="content">
       <div class="layui-tab-item layui-show">
          <table class="layui-table chart_table layui-form" lay-skin="line">
             <colgroup>
                <col width="50">
                <col width="50">
                <col width="40">
             </colgroup>
             <thead>
                <tr>
                   <!-- <th>次数</th> -->
                   <th>工作</th>
                   <th>开始时间/结束时间</th>
                   <th></th>
                </tr>
             </thead>
             <tbody>
               {volist name="record_list" id="vo"} 
                  <tr>
                     <!-- <td>
                        1
                     </td> -->
                     <td>{$vo.process.name}</td>
                     <td>
                        <span>{$vo.start_time}</span><br/>
                        <span>{$vo.end_time}</span>
                     </td>
                     <td>
                        {if $vo.status == 0} 
                           <button class="layui-btn btn-border sm" onclick='location.href=("/record_over/{$vo.id}")'>结束完成</button>
                           <button class="layui-btn btn-border sm jump" data-id="{$vo.id}" >跳过</button>
                           {elseif $vo.status == 2 /} 
                           <button class="layui-btn btn-border-yellow sm">已跳过</button>
                        {else /}
                            <button class="layui-btn btn-border-red sm">已完成</button>
                        {/if}
                        
                        <!-- <button class="layui-btn btn-border-yellow sm">终止</button> -->

                     </td>
                  </tr>
               {/volist}
                
      
             </tbody>
          </table>
          <input type="hidden" name="plan_id" value="{$plan_id}">
          <div class="recode_add1_text mt25">开始新工作</div>
          <div class="recode_add1_ul layui-form">
             <div class="item">
                <div class="b1">
                   <select name="process_id">
                     {volist name="process" id="process"} 
                        <option value="{$process.id}">{$process.name}</option> 
                     {/volist}

                   </select>
                </div>

                <button class="layui-btn sm1 start_record">开始</button>
             </div>
             <!-- <div class="item">
                <div class="b1">
                   <select>
                      <option>差距</option>
                   </select>
                </div>
                <button class="layui-btn sm1">开始</button>
             </div> -->
          </div>
       </div>
       <div class="layui-tab-item ">
          <table class="layui-table chart_table" lay-skin="line">
             <colgroup>
             </colgroup>
             <thead>
                <tr>
                   <th>序号</th>
                   <th>次数</th>
                   <th>工作</th>
                   <th>开始<br>
                      时间</th>
                   <th>结束
                      <br>时间
                   </th>
                   <th>状态</th>
                   <th></th>
                </tr>
             </thead>
             <tbody>
                <tr>
                   <td>1</td>
                   <td>1</td>
                   <td>挂钩</td>
                   <td>13:21</td>
                   <td>13:21</td>
                   <td>结束</td>
                   <td><span class="ftc">任务继续</span></td>
                </tr>
                <tr>
                   <td>1</td>
                   <td>1</td>
                   <td>挂钩</td>
                   <td>13:21</td>
                   <td>13:21</td>
                   <td>结束</td>
                   <td><span class="ftc">任务继续</span></td>
                </tr>
                <tr>
                   <td>1</td>
                   <td>1</td>
                   <td>挂钩</td>
                   <td>13:21</td>
                   <td>13:21</td>
                   <td>结束</td>
                   <td><span class="ftc">任务继续</span></td>
                </tr>
                <tr>
                   <td>1</td>
                   <td>1</td>
                   <td>挂钩</td>
                   <td>13:21</td>
                   <td>13:21</td>
                   <td>结束</td>
                   <td><span class="ftc">任务继续</span></td>
                </tr>
             </tbody>
          </table>

       </div>

    </div>
 </main>

{/block}
{block name="js"}
<script>
   $('.back').click(function(){
      window.location.href = '/record_index';
   })
   $('.start_record').click(function(){
      let planId = $('input[name="plan_id"]').val();
      let processId = $('select[name="process_id"]').val();
      if(!planId) return layer.msg('计划不得为空');
      if(!processId) return layer.msg('流程不得为空');
      ajaxRequest('/record_start', {plan_id:planId,process_id:processId}, 'POST', this, function (response) {
                layer.msg('操作成功', {icon: 1, time: 500}, function() {
                   window.location.reload();
                });
            });
   })
    $('#startRecordLink').click(function() {
            // 获取被选中的 radio 的值
            var craneId = $('input[name="crane_id"]:checked').val();

            // 检查是否选择了
            if (!craneId) {
                layer.msg('请先选择一个计划。');
                return;
            }

            // 构建新的链接，添加 crane_id 查询参数
            var newUrl = 'record_add/' + craneId;

            // 跳转到新的链接
            window.location.href = newUrl;
        });
        layui.use(['layer', 'jquery'], function () {
            var layer = layui.layer;
            var $ = layui.jquery;

            // 为按钮绑定点击事件
            $('.jump').on('click', function () {
               var record_id = $(this).data('id'); // 获取 data-id 值
               var  planId = $('input[name="plan_id"]').val();
               // 弹出确认框
               layer.confirm('确定要跳过吗？', {
                     title: '确认操作',
                     icon: 3, // 问号图标
                     btn: ['确定', '取消'] // 按钮文本
               }, function (index) {
                     // 用户点击确定后的逻辑
                     ajaxRequest('/record_jump', {plan_id:planId,record_id:record_id}, 'POST', this, function (response) {
                        layer.msg('操作成功', {icon: 1, time: 500}, function() {
                           window.location.reload();
                        });
                     });

                     layer.close(index); // 关闭弹窗
               });
            });
         });
 </script>
{/block}

